<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>demo</title>
		
		
		<script src="http://apps.bdimg.com/libs/jquery/1.6.4/jquery.js"></script>
	</head>
	<body>
		<style type="text/css">
			table{
				width: 400px;
				
			}
			th{
				width: 25%;;
				
			}
			td{
				width: 25%;
				background: #eee;
				text-align: center;
			}
		</style>
		
		<table id="tab">
			<tr>
				<th>one</th>
				<th>two</th>
				<th>three</th>
				<th>four</th>
			</tr>
			
		</table>
	</body>
	
	<script type="text/javascript">
		$(document).ready(function(){
			var stu = [{name: "a",age: 12,sex: "男",hobby: "vue"},
						{name: "b",age: 13,sex: "女",hobby: "node"},
						{name: "c",age: 14,sex: "男",hobby: "js"},
						{name: "d",age: 15,sex: "女",hobby: "jq"}			
					];
			var s;
			for(var i=0;i<4;i++){
				s = "<tr><td>" + 
				stu[i].name + "</td><td>" +
				stu[i].age + "</td><td>" + 
				stu[i].sex +"</td><td>" + 
				stu[i].hobby + "</td></tr>";
				$("#tab").append(s);
			}
//			var tab = document.getElementById('tab');
//			for(var j=0;j<4;j++){
//				var tr = document.createElement("tr");
//				for(var i=0;i<4;i++){
//					var td = document.createElement("td");
//					tr.appendChild(td);
//					tab.appendChild(tr);
//					td.innerText = aa[j][i];	
//				}
//				
//			}
//			console.log(tab.rows[0].cells.length);
			
	})
	</script>
</html>
